  <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="description" content="sj-oj">
	<meta name="author" content="IT行者工作室">
	<title>index</title>
	<!-- Bootstrap -->
	<link href="css/bootstrap.min.css" rel="stylesheet">
	<link href="css/style.css" rel="stylesheet">

	<!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元素和媒体查询，如果不需要用可以移除 -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
</head>
<body>

	<header id="header" class="form-group">

		<nav class="navbar navbar-inverse" role="banner">
			<div class="container">
				<div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
					<h2 class="navbar-brand" href="index.jsp">SJ-OJ系统</h2>
				</div>
				<div class="collapse navbar-collapse navbar-right">
					<ul class="nav navbar-nav">
                        <li><a href="getProblemList.do">Home</a></li><!-- 主页 -->
						<li class="active"><a href="getProblemList.do">problem</a></li><!-- 问题 -->
						<li><a href="getranklist.do">Stauts</a></li><!--所有答题状态 -->
						<li><a href="#">Ranklist</a></li><!--排行 -->
                        <li><a href="#">Contest</a></li><!--比赛测试 -->
						<li><a href="#">Online</a></li><!-- 待定-->
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Others<strong class="caret"></strong></a>
                            <ul class="dropdown-menu">
                                <li>
                                    <a href="#">Action</a>
                                </li>
                                <li>
                                    <a href="#">Another action</a>
                                </li>
                                <li>
                                    <a href="#">Something else here</a>
                                </li>
                                <li class="divider">
                                </li>
                                <li>
                                    <a href="#">Separated link</a>
                                </li>
                                <li class="divider">
                                </li>
                            </ul>
                        <%--这边登录要做优化，判断是否已经登录，登录则将下拉菜单修改成相应模块--%>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Wecome <b class="user-name" style="color: #f35b6b;font-size: 22px;">${sessionScope.user_id}</b><b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="login.jsp">login</a></li>
                                <li><a href="register.jsp">register</a></li>
                            </ul>
                        </li>
					</ul>
				</div>

			</div><!--/.container-->
		</nav><!--/nav-->

	</header><!--/header--><!--/#error-->

	<div class="container form-group">
		<form action="getProblemList.do">
            <table class="table table-striped table-hover">
                <tr>
                    <th>题号</th>
                    <th>题名</th>
                    <th>已提交</th>
                    <th>已解决</th>
                </tr>
                <c:forEach var="problemlist" items="${problemlist }">
                    <tr>
                        <td>${problemlist.problem_id}</td>
                        <td><a href="${problemlist.problem_id}">${problemlist.title}</a></td>
                        <td>${problemlist.submit}</td>
                        <td>${problemlist.solved}</td>
                    </tr>
                </c:forEach>
            </table>
            <div class="col-sm-4"></div>
            <div class="col-sm-3">
                <select name="pageNo" class="form-control">
                    <c:forEach var="totalPagelist" items="${totalPagelist }">
                        <option value="${totalPagelist}">
                            第 ${totalPagelist} 页
                        </option>
                    </c:forEach>
                </select>
            </div>

             <div class="col-sm-3">
                <select name="pageSize" class="form-control">
                        <option value="10">显示10行</option>
                        <option value="20">显示20行</option>
                        <option value="30">显示30行</option>
                </select>
              </div>
             <div class="col-sm-2">
                        <input type="submit" value="确定" class="btn btn-block btn-info sub-en">
             </div>
	    </form>
	</div>



	<footer id="footer" class="midnight-blue content" >
		<div class="container">
			<div class="row">
				<div class="col-sm-6" align="center">
                    Copyright © 2016 <a target="_blank" href="http://www.sju.js.cn/jsjkx/main.htm">三江学院计算机科学与技术学院</a> All Rights Reserved.
				</div>
				<div class="col-sm-6">
                    <div align="center">
                        <ul>
                            <li><a href="#">About Us</a></li>
                            <li>Any problem, Please Contact <a href="#" class="text-color">IT行者工作室</a></li>
                        </ul>
                    </div>
				</div>
			</div>
		</div>
	</footer><!--/#footer-->
    <script>
//        当页面长度小于屏幕高度时固定footer在最下面
        function ct(){
            return document.compatMode == "BackCompat"? document.body.clientHeight:document.documentElement.clientHeight;
        }
        var f=document.getElementById('footer');
        (window.onresize=function(){
            f.style.position=document.body.scrollHeight>ct()?'':'absolute';
        })();
    </script>
	<script src="js/jquery.min.js"></script>
	<!-- 包括所有bootstrap的js插件或者可以根据需要使用的js插件调用　-->
	<script src="js/bootstrap.min.js"></script>
</body>
</html>
